import React, { Component} from 'react';
import { connect } from 'react-redux';
import ContainChild from './recycle-contain-child';
import { getDeletePreview } from '../../api/getDeletePreview';
import { getUser } from '../../api/getUser';

class contain extends Component{

    componentWillMount(){
        var _that = this;
        getUser()
        .then(function(){
            var { user } = _that.props;
            getDeletePreview(user)
        })
        
    }

    render(){
        var { recycleList } = this.props;

        var recycleList = recycleList.map(function(recycle, i){
            return <ContainChild recycle = { recycle } key = { i }/>
        });
        return (
            <div className="layout">
                <ul className="header row">
                    <li className="col-xs-2">文件名</li>
                    <li className="col-xs-2">所在文件夹</li>
                    <li className="col-xs-3">删除日期</li>
                    <li className="col-xs-3">摘要</li>
                    <li className="col-xs-2">销毁/撤销</li>
                </ul>
                <section className="delete-container row">
                    { recycleList }
                </section>
            </div>
        )
    }
}

const mapStateToProps = (state, ownProps) => {
    return {
        user: state.userInitState,
        recycleList: state.recycleReducer.recycleList
    }
}

const mapDispatchToProps = (dispatch, ownProps) => {
    return {}
}
export default connect(
    mapStateToProps, 
    mapDispatchToProps
)(contain);